<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:h="http://xmlns.jcp.org/jsf/html">

    <body>

        <ui:composition template="Template.xhtml">
        <ui:define name="top">
            配送路线图

        </ui:define>


            <ui:define name="content" id="content">
                <f:metadata>
                    <f:viewParam name="idproblem" value="#{pointsMB.idproblemparam}"/> 
                    <f:viewParam name="idsolution" value="#{pointsMB.idsolutionparam}"/> 
                </f:metadata>
                <f:event listener="#{pointsMB.prerender()}"
                         type="preRenderView"></f:event>

                <p:panel style="height: inherit;" rendered="#{pointsMB.render}">
                    <h:form id="select" style="height: 100%">
                        <p:panelGrid styleClass="noborder left" columns="3"   >
                            <p:panelGrid styleClass="noborder left" columns="3" rendered="#{pointsMB.rendersolution}">
                                <h:outputText value="#{bundle.solution}:" />
                                <p:selectOneMenu id="solution" value="#{pointsMB.idsolution}" >
                                    <f:selectItems var="solution" value="#{pointsMB.sl}" itemValue="#{solution.idsolution}" itemLabel="#{solution.createdate}"/>
                                </p:selectOneMenu>
                                <p:commandButton value="确认" update="@form"  action="#{pointsMB.onsubmit()}">  </p:commandButton>
                            </p:panelGrid>
                            <p:panelGrid styleClass="noborder left" columns="3"   >
                                <h:outputText value="#{bundle.vehicle}:" />
                                <p:selectCheckboxMenu id="taskmenu" rendered="#{pointsMB.solution!=null}" value="#{pointsMB.tasklist}" label="#{bundle.vehicle}" converter="#{taskConvert}" style="width: 100px">
                                    <f:selectItems var="task" itemLabel="#{task.idattendance.iddriver.iduser.name}:#{task.idattendance.idvehicle.plate}" itemValue="#{task}" value="#{pointsMB.solution.taskList}" />
                                </p:selectCheckboxMenu>
                                <p:commandButton value="确认" update="@form"  action="#{pointsMB.submittask()}">  </p:commandButton>
                            </p:panelGrid>
                            <p:button value="#{bundle.back}" outcome="/admin/solution/view.xhtml" >
                                <f:param name="idsolution" value="#{pointsMB.idsolution}" />
                            </p:button>
                        </p:panelGrid>
                        <div id="allmap" style="width: 100%;height:800px; overflow: hidden"></div>

                        <script type="text/javascript">

                    var points = [#{pointsMB.points}];
                    var depotpoints = [#{pointsMB.depotPoints}];
                    var lables = [#{pointsMB.order}];
                    var cds = [#{pointsMB.cdStr}];
                    var polyLines = [#{pointsMB.linesArray}];
                    // 百度地图API功能
                    var map = new BMap.Map("allmap");
                    var top_left_control = new BMap.ScaleControl({anchor: BMAP_ANCHOR_TOP_LEFT}); // 左上角，添加比例尺
                    var top_left_navigation = new BMap.NavigationControl(); //左上角，添加默认缩放平移控件

                    //map.enableScrollWheelZoom(false);
                    var point = new BMap.Point(118.620654, 24.912424);
                    map.centerAndZoom(depotpoints[0], 15);
                    map.addControl(top_left_control);
                    map.addControl(top_left_navigation);
                    map.addControl(new BMap.CityListControl({anchor: BMAP_ANCHOR_TOP_RIGHT}));
                    // 编写自定义函数,创建标注
                    function addMarker(point, lable,message) {
                    var marker = new BMap.Marker(point);
                    var la = new BMap.Label(lable, {offset:new BMap.Size( - 10, - 20)});
                    marker.setLabel(la);
   
                    marker.addEventListener("click", function () {
           
                    var opts = {
                    width: 250, // 信息窗口宽度
                            height: 200, // 信息窗口高度
                            title: "订单信息" // 信息窗口标题
                    }
                    var infoWindow = new BMap.InfoWindow(message, opts); // 创建信息窗口对象 
                    map.openInfoWindow(infoWindow, point); //开启信息窗口

                    });
                    map.addOverlay(marker);
                    }

                    //depot
                    function adddepotMarker(point) {
                    var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png", new BMap.Size(23, 25), {
                    offset: new BMap.Size(10, 25), // 指定定位位置
                            imageOffset: new BMap.Size(0, 0 - 10 * 25) // 设置图片偏移
                    });
                    var marker = new BMap.Marker(point, {icon:myIcon});
                    var message;
                    var geoc = new BMap.Geocoder();
                    marker.addEventListener("click", function () {
                    geoc.getLocation(point, function (rs) {
                    //			var addComp = rs.addressComponents;
                    message = rs.address;
                    var infoWindow = new BMap.InfoWindow(message, opts); // 创建信息窗口对象 
                    map.openInfoWindow(infoWindow, point); //开启信息窗口
                    });
                    var opts = {
                    width: 200, // 信息窗口宽度
                            height: 100, // 信息窗口高度
                            title: "地址" // 信息窗口标题

                    }

                    });
                    map.addOverlay(marker);
                    }
                    adddepotMarker(depotpoints[0]);
                    for (var i = 0; i &lt; points.length; i++) {
                    addMarker(points[i], lables[i],cds[i]);
                    //console.log(point);
                    }

//                    var polyLines = [#{pointsMB.linesArray}];
                    for (var i = 0; i &lt; polyLines.length; i++) {


                    polyLines[i].addEventListener("click", function(){
                    this.enableEditing();
                    });
                    polyLines[i].addEventListener("dblclick", function(){
                    this.disableEditing();
                    });
                    map.addOverlay(polyLines[i]); //增加折线
                    }


                        </script> 
                    </h:form>
                </p:panel>
            </ui:define>

        </ui:composition>

    </body>
</html>
